<template>
	<header>
		<UserPanel :photo="photo" :userName="userName" :department="department"></UserPanel>
		<TopNav :navItems="navItems"></TopNav>
	</header>
</template>

<script>
import UserPanel from "@/components/common/UserPanel.vue";
import TopNav from "@/components/common/TopNav.vue";

export default {
  name: "TopBar",
  data: function() {
    return {
      photo: require("../../assets/images/avatar.png"),
      userName: "韩冰",
      department: "品牌策划部",
      navItems: [
        {
          id: 1,
          icon: "graph-task",
          name: "任务"
        },
        {
          id: 2,
          icon: "graph-email",
          name: "邮件"
        }
      ]
    };
  },
  components: {
    UserPanel,
    TopNav
  }
};
</script>

<style lang="less">
#header {
  height: 50px;
}
</style>
